<template>
  <div class='basePrivilegecreate'>
      <el-page-header @back="goBack" content="新增应用"></el-page-header>
     {{form}}
      <el-form label-width="100px" size="small">
          <el-form-item label="名称">
              <el-input v-model="form.name"></el-input>
          </el-form-item>
           <el-form-item label="description">
              <el-input v-model="form.description"></el-input>
          </el-form-item>
           <el-form-item label="route">
              <el-input v-model="form.route"></el-input>
          </el-form-item>
           <el-form-item label="routeName">
              <el-input v-model="form.routeName"></el-input>
          </el-form-item>
        
          <el-form-item label="类型">
              <el-input v-model="form.type"></el-input>
          </el-form-item>
          <el-form-item label="图标">
              <el-input v-model="form.icon"></el-input>
          </el-form-item>
          <el-form-item label="hidden">
              <el-input v-model="form.hidden"></el-input>
          </el-form-item>
          <el-form-item label="num">
              <el-input v-model="form.num"></el-input>
          </el-form-item>
          <el-form-item label="parentId">
              <el-input v-model="form.parentId"></el-input>
          </el-form-item>
          <el-form-item style="text-align:right" >
              <el-button  type="primary" @click="submitHandler">提交</el-button>
          </el-form-item>
      </el-form>
  </div>
</template>
<script>
import {post} from '@/utils/request';
export default {
  // 组件名称
  name: 'demo',
  // 组件参数 接收来自父组件的数据
  props: {},
  // 组件状态值
  data () {
   return {
     form:{}
   }
  },
  // 计算属性
  computed: {},
  // 侦听器
  watch: {},
  // 组件方法
  methods: {
    submitHandler(){
      //获取参数
      let url="http://121.196.106.124:8888/BasePrivilege/saveOrUpdate"
      post(url,this.form).then(resp =>{
        //提示用户录入完成
        this.$message({type:"success",message:resp.message})
        //返回，展示
        this.goBack();
      })
    },
    goBack(){
      this.$router.back();
    }
  },
  // 以下是生命周期钩子
  /**
  * 组件实例创建完成，属性已绑定，但DOM还未生成，$ el属性还不存在
  */
  created () {
      // console.log(this.$route);
    this.form=this.$route.query;
  },
  /**
  * el 被新创建的 vm.$ el 替换，并挂载到实例上去之后调用该钩子。
  * 如果 root 实例挂载了一个文档内元素，当 mounted 被调用时 vm.$ el 也在文档内。
  */
  mounted () {
    
  },
  /**
  * 实例销毁之前调用。在这一步，实例仍然完全可用。
  */
  beforeDestroy () {
  },
  /**
  * Vue 实例销毁后调用。调用后，Vue 实例指示的所有东西都会解绑定，
  * 所有的事件监听器会被移除，所有的子实例也会被销毁。
  */
  destroyed () {
  }
}
</script>
// export default {
//      data(){
//       return{
//        form:{}
//     }
//     },
//         methods:{
//             submitHandler(){
//              //获取参数,将参数提交给后台
//              let url="http://121.196.106.124:8888/BasePrivilege/saveOrUpdate"
//              post(url,this.form).then(resp =>{
//                  this.$message({type:"success",message:resp.message})
//                  this.goBack();
//              })
//             },
//             goBack(){
//             this.$router.back();
//             },
            
//         },
//     created(){
//             //获取路由参数
//             //参数绑定this.form
//         this.form=this.$route.query;
//         },
// }
// </script>
<style scoped>

</style>
